﻿
(function ($) {
    $.extend({

        Overlay: {
            defaults: {
                bg: '#333333',
                opacity: 0.3,
                width: '100%',
                showDuration: 500,
                hideDuration: 300
            },
            options: {},

            format: function () {
                var result = arguments[0];
                for (var i = 1; i < arguments.length; i++) {
                    result = result.replace(new RegExp('\\{' + (i - 1) + '\\}', 'g'), arguments[i]);
                }
                return result;
            },

            getId: function () {
                return $(this.format("#overlay_{0}", this.Id));
            },
            getDocHeight: function () {

                var b = document.body,
                e = document.documentElement,
                w = 0,
                h = 0;
                if (e) {
                    //w = Math.max(w, e.scrollWidth, e.offsetWidth);
                    h = Math.max(h, e.scrollHeight, e.offsetHeight);
                }
                if (b) {
                    // w = Math.max(w, b.scrollWidth, b.offsetWidth);
                    h = Math.max(h, b.scrollHeight, b.offsetHeight);
                    if (window.innerWidth) {
                        //  w = Math.max(w, window.innerWidth);
                        h = Math.max(h, window.innerHeight);
                    }
                }
                return h; // [w, h];

            },

            create: function (s) {

                this.options = s = $.extend(true, {}, this.defaults, s || {});

                this.Id = new Date().getTime();
                var o = $(this.format('<div id="overlay_{0}"></div>', this.Id));

                var _h = this.getDocHeight();

                $('body').append(o);

                o.css({
                    position: 'absolute',
                    top: 0,
                    left: 0,
                    'background-color': s.bg,
                    opacity: s.opacity,
                    zIndex: s.zIndex,
                    width: s.width,
                    height: _h
                }).hide().fadeIn(s.showDuration);


            },
            show: function (s) {

                if (this.Id) {
                    this.getId().fadeIn(this.options.showDuration);
                }
                else {
                    this.create(s);
                }

            },
            hide: function () {
                this.getId().fadeOut(this.options.hideDuration);
            }

        }
    });

})(jQuery);



